<template>
  <div class="page_body">
    <HomeTop :topTitle="topTitle"></HomeTop>
    <div class="referee_order_List_body">
      <!-- 列表 -->
      <div
        class="referee_order_List"
        v-if="listDataShow.length != 0 || vipListDataShow.length != 0"
      >
        <div
          class="referee_order_List_item"
          v-for="(item, index) in vipListDataShow"
          :key="index"
          @click="toDetail(1, item.record_id)"
        >
          <div class="referee_order_List_item_left">
            <img
              class="referee_order_List_item_honor"
              src="../../assets/image/honor_icon01.png"
              v-if="item.audit_status == 2"
            />
            <img
              class="referee_order_List_item_honor"
              src="../../assets/image/honor_icon04.png"
              v-else
            />

            <div class="referee_order_List_item_title_box">
              <div class="referee_order_List_item_title">
                【{{ item.year }}】年上海篮球协会-注册会员
              </div>
              <div
                class="referee_order_List_item_status"
                v-if="item.audit_status == 2"
              >
                &nbsp;获得时间: {{ filterDate(item.audit_time) }}
              </div>
              <div
                class="referee_order_List_item_status status_o"
                v-if="item.audit_status == 1"
              >
                &nbsp;未审核
              </div>
              <div
                class="referee_order_List_item_status status_r"
                v-if="item.audit_status == 3"
              >
                &nbsp;审核未通过
              </div>
            </div>
          </div>
          <img
            class="referee_order_List_item_right"
            src="../../assets/image/to_icon03.png"
          />
        </div>
        <div
          class="referee_order_List_item"
          v-for="(item, index) in listDataShow"
          :key="index"
          @click="toDetail(2, item.record_id)"
        >
          <div class="referee_order_List_item_left">
            <img
              class="referee_order_List_item_honor"
              src="../../assets/image/honor_icon02.png"
              v-if="item.audit_status == 2"
            />
            <img
              class="referee_order_List_item_honor"
              src="../../assets/image/honor_icon04.png"
              v-else
            />

            <div class="referee_order_List_item_title_box">
              <div class="referee_order_List_item_title">
                【{{ item.year }}】年上海篮球协会-注册裁判员
              </div>
              <div
                class="referee_order_List_item_status"
                v-if="item.audit_status == 2"
              >
                &nbsp;获得时间: {{ filterDate(item.audit_time) }}
              </div>
              <div
                class="referee_order_List_item_status status_o"
                v-if="item.audit_status == 1"
              >
                &nbsp;待年审认证
              </div>
              <div
                class="referee_order_List_item_status status_r"
                v-if="item.audit_status == 3"
              >
                &nbsp;年审未通过
              </div>
            </div>
          </div>
          <img
            class="referee_order_List_item_right"
            src="../../assets/image/to_icon03.png"
          />
        </div>
      </div>
      <div class="empty_box" v-else>
        <img class="empty_icon" src="../../assets/image/empty_icon01.png" />
        <div class="empty_name">暂无数据</div>
      </div>
    </div>
  </div>
</template>
<style src="../../assets/css/order/refereeRegisterOrderList.css" scoped></style>

<script>
import HomeTop from "@/components/homeTop.vue";
import { Toast } from "mint-ui";

export default {
  name: "RefereeRegisterOrderList",
  components: {
    HomeTop,
  },
  data() {
    return {
      topTitle: "注册信息", // 顶部组件参数设置
      listDataShow: [],
      vipListDataShow: [],
    };
  },
  created: function () {
    this.getListDataFn();
  },
  methods: {
    // 查询列表数据
    getListDataFn: function () {
      let that = this;
      let url = "/mobile/refereeOrderList";
      let data = {};
      this.axios
        .post(url, data)
        .then((response) => {
          if (response.code == 0) {
            that.listDataShow = response.referee_register;
            that.vipListDataShow = response.referee_vip;
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
    // 查看填写
    toDetail: function (key, record_id) {
      // if (key == 1) {
      //   this.$router.push({
      //     name: "RefereeMemberView",
      //   });
      // } else {
      //   this.$router.push({
      //     name: "RefereeRegisterOrderView",
      //   });
      // }
      this.$router.push({
        name: "RefereeRegisterOrderView",
        query: {
          type: key,
          recordId: record_id,
        },
      });
    },
    // 过滤时间格式
    filterDate: function (val) {
      let newDate = new Date(val);
      let year = newDate.getFullYear();
      let month = newDate.getMonth();
      let day = newDate.getDate();
      // let hours = newDate.getHours();
      // let minutes = newDate.getMinutes();
      // let seconds = newDate.getSeconds();
      let str =
        year +
        "年" +
        (month + 1 > 10 ? month + 1 : "0" + (month + 1)) +
        "月" +
        day +
        "日 ";

      return str;
    },
  },
};
</script>
